<template>
  <div class="app">
    <transition>
      <keep-alive>
        <router-view v-if="isRouterAlive"></router-view>
      </keep-alive>
    </transition>
    <van-tabbar
      v-model="$store.state.activeinfo"
      active-color="#07c160"
      inactive-color="#000"
      fixed
    >
      <van-tabbar-item icon="bag-o" to="/position/worklist">职位</van-tabbar-item>
      <van-tabbar-item icon="newspaper-o" to="/company">公司</van-tabbar-item>
      <van-tabbar-item icon="more-o" info="5" to="/new">消息</van-tabbar-item>
      <van-tabbar-item icon="friends-o" to="/myhome">我的</van-tabbar-item>
    </van-tabbar>
  </div>
</template>
<script>
export default {
  provide () {
    return {
      reload: this.reload
    }
  },
  data: () => ({
    isRouterAlive: true
  }),
  created () {},
  methods: {
    reload () {
      this.isRouterAlive = false
      this.$nextTick(function () {
        this.isRouterAlive = true
      })
    }
  }
}
</script>
<style lang="less" scoped>
.app {
  overflow-x: hidden;
}
.van-icon-plus {
  margin-right: 5px;
}
.v-enter {
  transform: translateX(100%);
}
.v-leave-to {
  position: absolute;
  transform: translateX(-100%);
  left: -400%;
}
.v-enter-active,
.v-leave-active {
  transition: 0.6s;
}

</style>
